<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</body>
<script>
    // 1、Array.of函数 函数作用：将一组值，转换成数组。
    console.log(Array.of(1, 2, 3, 4));
    // 2、Array.from函数 函数作用：可以将类似数组的对象或者可遍历的对象转换成真正的数组。
    let arrList = document.getElementsByTagName('li')
    console.log(arrList);
    console.log(Array.from(arrList));
    var str = 'web31'
    console.log(Array.from(str));
    // 深拷贝  传值
    let arr = [1, 2, 3, 4]
    let arr_1 = Array.from(arr)
    arr.push(5)
    console.log(arr_1);
    // 3、find函数 函数作用：找出数组中符合条件的第一个元素。没找到就是undefined
    // arr.forEach(function(){

    // })
    let value = arr.find(function (item, index, arr) {
        // console.log(item);
        // console.log(index);
        // console.log(arr);
        return item > 5

    })
    console.log(value);
    // 4、findIndex函数 函数作用：返回符合条件的第一个数组成员的位置下标,没找到就是-1
    let index = arr.findIndex(function (item, index) {
        return index > 2
    })
    console.log(index);
    // 5、fill函数 函数作用：用指定的值，填充到数组。 会改变原数组
    console.log(arr.fill(6, 1, 3));
    console.log(arr);
    // 6、entries函数 函数作用：对数组的键值对进行遍历，返回一个遍历器，可以用for..of对其进行遍历。
    var obj = {
        name: 'zs'
    }
    let list = [6, 7, 8]
    console.log(list.entries());
    for (let [key, value] of list.entries()) {
        // console.log(key);
        console.log(value);
    }
    // 7、keys函数  对数组的键进行遍历，返回一个遍历器，可以用for..of对其进行遍历
    console.log(list.keys());
    for (let keys of list.keys()) {
        console.log(keys);
    }
    // 8、values函数  对数组的值进行遍历，返回一个遍历器，可以用for..of对其进行遍历
    console.log(list.values());
    for (let values of list.values()) {
        console.log(values);
    }
    // 迭代
    // forEach
    console.log(list.forEach(function (item) {
        return item
    }));

    console.log(list.map(function (item) {
        return item + 1
    }));
</script>

</html>